import React from 'react';
import { render } from 'react-dom';
import { Router, Route, IndexRoute } from 'react-router'
import View from 'lib/View.jsx'
import RootView from './RootView.jsx'
import Layout from '../common/layout.jsx'
import DetailView from './DetailView.jsx'
import moment from 'moment';
import history from '../common/history.es6';
require('./style.less')

class MainView extends View {
  constructor(props, context) {
    super(props, context);

    this.releaseDate = moment('2015-11-11');
  }

  render() {
    let subTitle = 'ANR 统计和详情' + (moment().valueOf() > this.releaseDate.add(60, 'days').valueOf() ? '' : '（Beta）');
    return (
      <Layout title="ANR" subtitle={subTitle} hideTime={true}>
        { React.cloneElement(this.props.children, { routeParams: this.props.params, key: this.getHandlerKey() }) }
      </Layout>
    );
  }
}

render((
  <Router history={ history }>
    <Route path="/" component={MainView}>
      <Route path="/:anrTypeId/:endTime" component={DetailView} />
      <IndexRoute component={RootView} />
    </Route>
  </Router>
), document.getElementById('root'));
